<template>
  <router-view />
</template>

<script lang="ts">
  import {
    defineComponent,
    ref,
    provide
  } from 'vue'
  export default defineComponent({
    setup() {
      const height = ref < number > (0)
      const u = navigator.userAgent;
      const isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
      const sendStatusBarHeight: (statusHeight: number) => void = (statusHeight: number) => {
        height.value = statusHeight + 48
        console.log("接收:", height.value);
      }
      //Vue的方法给原生调用，则需要把方法挂在Window下面
      if (isiOS) { 
        if ((window as any).webkit) { 
          (window as any).sendStatusBarHeight = sendStatusBarHeight;
          (window as any).webkit.messageHandlers.getStatusBarHeight.postMessage({});
        } 
      } else {
        if ((window as any).app.getStatusBarHeight) {
          height.value = (window as any).app.getStatusBarHeight() / (window as any).devicePixelRatio + 48
        }
      } 
      provide('getHeight', height.value)     
      return {}
    }
  })
</script>